<template>
	<view class="body">
		<view class="setbox">
			<view class="setbox1"> 头像 </view>
			<view class="setbox3" @tap="beforeUpload">
				<image class="setbox_img" :src="[avatar?avatar:'/static/image/noimg.png']" mode=""></image>
			</view>
		</view>
		
		<view class="setbox">
			<view class="setbox1"> 昵称 </view>
			<view class="setbox2">
				<input type="text" @input="getnickname" :value="nickname" placeholder="请输入">
			</view>
		</view>

		<view class="setbox">
			<view class="setbox1"> 生日 </view>
			<view class="setbox2">
				<picker mode="date" :value="time" @change="bindTimeChange">
					<view class="uni-input">{{birthday?birthday:'请选择'}}</view>
				</picker>
			</view>
		</view>
		
		<view style="height: 100rpx;"></view>
		
		<view class="setbox_btn" @tap="submits">
			保 存
		</view>
		
	</view>
</template>

<script>
	
	import {curl} from 'common/api.js';
	import {baseUrl} from "common/config.js";
	export default {
		data() {
			return {
				avatar:'',
				birthday:'',
				nickname:''
			}
		},
		onShow() {
			var that=this;
			curl('member/getuserinfo', {}).then((res) => {
				console.log('用户信息',res.data);
				that.userinfo=res.data;
				that.avatar=res.data.avatar;
				that.birthday=res.data.birthday;
				that.nickname=res.data.nickname;
			});
		},
		methods: {
			
			// 上传图片
			beforeUpload(types) {
				var that=this;
				var token = uni.getStorageSync('token');
				console.log(types);
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: function (res) {
						var ss=res.tempFilePaths;
						that.imgurl=ss[0];
						uni.uploadFile({
							url: `${baseUrl}`+'common/upload',
							// url: "/dpc" + 'upload',
							filePath: ss[0], // 本地上传完成后的路径
							name: 'file', 
							formData: {},
							header:{"token": token},
							success: function(uploadFileRes) {
								var ret=JSON.parse(uploadFileRes.data);
								
								console.log(ret.data.fullurl)
								that.avatar=ret.data.fullurl
							}
						});
					
					}
				});
			},
		
			submits(){
				var that=this;
				var nickname=this.nickname;
				var birthday=this.birthday;
				var avatar=this.avatar;
				
				
				curl('member/setuserinfo', {'avatar':avatar,birthday:birthday,nickname:nickname}).then((res) => {
					console.log(res.data);
					
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
					
				});
			},
			getnickname(ret){
				this.nickname=ret.detail.value
			},
			
			bindTimeChange(ret){
				console.log(ret);
				this.birthday=ret.detail.value
			}
		}
	}
</script>

<style>
	.setbox2>input{
		width: 400rpx;height: 40rpx;line-height: 40rpx;
	}
	.setbox2{
		width: 400rpx;text-align: right;
	}
	.setbox3>image{
		width: 80rpx;height: 80rpx;border-radius: 80rpx;
	}
	.setbox3{
		width: 80rpx;height: 80rpx;
	}
	.setbox1{
		width: 200rpx;height: 80rpx;line-height: 80rpx;
		font-size: 28rpx;color: #000000;
	}
	.setbox{
		width: 700rpx;height: 120rpx;margin: auto;
		border-bottom: 1px solid #ececec;
		display: flex;align-items: center;justify-content: space-between;
	}
	
	.setbox_btn{
		width: 700rpx;height: 80rpx;
		margin: 20rpx auto;
		text-align: center;line-height: 80rpx;
		background:#08b059 ;
		color: #ffffff;border-radius: 80rpx;font-size: 32rpx;font-weight: 500;
	}
	.body{
		width: 100%;min-height: 100vh;
		background: #fcfcfc;
	}
</style>
